<template>
    <Row>
        
 
             <Col span="4">
                    <Content>
                        <Tree :data="data1" show-checkbox   on-check-change="onSelection" ></Tree>
                    </Content>
             </Col>


             <Col span="8">
                    <Table :columns="columns1" :data="datatitle"></Table>
             </Col>


             <Col span="12">
             
                        <Header class="layout" :data="datatitle">title</Header>
                        <Content class="layout" :data="mian">mian</Content>
                        <Footer class="layout" :data="name">name</Footer>
                        <Footer class="layout" :data="time">time</Footer>
             
             </Col>
              
            
    
                   
                    


      
               
            


       
    </Row>
</template>
<script>
export default {
  data() {
    return {
      data1: [],
      datatitle: [],
      mian: [],
      name: [],
      time: [],
      type: 1,
      title: "",
      columns1: [
        {
          title: "标题",
          key: "title",
          width:220
        },
        {
          title: "操作",
          key: "action",
          width: 150,
          align: "center",
          render: (h, params) => {
            return h("div", [
                 h(
                "Button",
                {
                  props: {
                    type: "error",
                    size: "small"
                  },
                  on: {
                    click: () => {
                      this.remove(params.index);
                    }
                  }
                },
                "增"
              ),
              h(
                "Button",
                {
                  props: {
                    type: "primary",
                    size: "small"
                  },
                  style: {
                    marginRight: "1px"
                  },
                  on: {
                    click: () => {
                      this.show(params.index);
                    }
                  }
                },
                "改"
              ),
              h(
                "Button",
                {
                  props: {
                    type: "error",
                    size: "small"
                  },
                  on: {
                    click: () => {
                      this.remove(params.index);
                    }
                  }
                },
                "删"
              ),


            ]);
          }
        }
      ],
      datatitle: [
        {
          title: ""
        }
      ]
    };
  },
  methods: {
    aa() {
      this.axios({
        url: `http://localhost:3000/cate/list/4`,
        method: "get"
      }).then(res => {
        // console.log(res.data)
        this.data1 = res.data;
      });
    },
    bb() {
      this.axios({
        url: `http://localhost:3000/news/list/`,
        method: "post"
      }).then(res => {
        console.log(res.data.docs);
        this.datatitle = res.data.docs;
        this.name = name;
        //this.type=type;
      });
    },

    onSelectChange() {}
  },
  mounted() {
    this.aa(), this.bb();
  }
};
</script>

<style scoped>
.layout {
  background: #fff;
  position: relative;
  border-radius: 4px;
  overflow: hidden;
  border-bottom: 1px solid #cccccc;
}
</style>
